<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/1/16
  Time: 15:51
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <title>人员查询</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <script src="/static/js/jquery-3.3.1.js"></script>
    <link rel="stylesheet" href="/static/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/layuiadmin/style/admin.css" media="all">
    <script src="/static/layuiadmin/layui/layui.js" type="text/javascript"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
<br/>
<div class="demoTable">

    <form id="myform" class="layui-form"  lay-filter="example" >

        <div class="layui-form">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">发布日期：</label>
                    <div class="layui-input-inline">
                        <input name="startTime" lay-verify="startTime" type="text" class="layui-input" id="test5" placeholder="yyyy-MM-dd HH:mm:ss">
                    </div>
                    <div class="layui-form-mid">-</div>
                    <div class="layui-input-inline">
                        <input name="endTime" lay-verify="endTime" type="text" class="layui-input" id="test1" placeholder="yyyy-MM-dd HH:mm:ss">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">管理员:</label>
                    <div class="layui-input-inline">
                        <input type="text" name="pname" lay-verify="pname" autocomplete="off" placeholder="用户名" class="layui-input">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">所属机构:</label>
                    <div class="layui-input-inline">
                        <input type="text" name="mid" lay-verify="mid" autocomplete="off" placeholder="机构" class="layui-input">
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">状态:</label>
                    <div class="layui-input-inline">

                        <select name="status" lay-filter="status">
                            <option value="" >全部</option>
                            <option value="0" >冻结</option>
                            <option value="1" >激活</option>
                        </select>
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">人员角色:</label>
                    <div class="layui-input-inline">
                        <select id="s1" name="rid" lay-filter="rid">

                        </select>
                    </div>
                </div>


            </div>
        </div>
    </form>

    <div class="layui-inline" style="margin-left: 50%;">
        <button class="layui-btn" lay-submit="" lay-filter="demo1" onclick="sear()">查询</button>
    </div>


</div>
<table class="layui-hide" id="test" lay-filter="test"></table>

<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <%--<button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
        <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
        <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>--%>
        <button class="layui-btn layui-btn-sm" lay-event="insertPeople">新增人员</button>

    </div>
</script>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    {{# if(d.status==0){}}
    <a class="layui-btn layui-btn-xs" lay-event="jihuo">激活</a>
    {{# }else{}}
    <a class="layui-btn layui-btn-xs" lay-event="jihuo">冻结</a>
    {{# }}}
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>
    jQuery.prototype.serializeObject=function(){
        var obj=new Object();
        $.each(this.serializeArray(),function(index,param){
            if(!(param.name in obj)){
                obj[param.name]=param.value;
            }
        });
        return obj;
    };
</script>

<script>
console.log(${list});
    layui.use('table', function(){
        var $ = layui.$
        var param = JSON.stringify($('#myform').serializeObject());
        var table = layui.table;
        table.render({
            elem: '#test'
            ,url:'/people/pagePeople?param='+encodeURIComponent(param)
            ,toolbar: '#toolbarDemo'
            ,title: '人员信息查询表'
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'pid', title:'ID',  fixed: 'left', }
                ,{field:'addTime', title:'添加时间',  fixed: 'left',sort: true}
                ,{field:'pname', title:'账号',  fixed: 'left', unresize: true, sort: true}
                ,{field:'realname', title:'姓名',  fixed: 'left', unresize: true}
                ,{field:'phonenum', title:'手机号',  fixed: 'left', unresize: true}
                ,{field:'email', title:'邮箱',  fixed: 'left'}
                ,{field:'lastLoginTime', title:'最后登录时间',  fixed: 'left'}
                ,{field:'lastLoginIp', title:'最后登录IP',  fixed: 'left'}
                ,{field:'loginNum', title:'登录次数',  fixed: 'left'}
                ,{field:'mechanism', title:'所属机构',  fixed: 'left',templet: function (t) {return t.mechanism.mname;}}
                ,{field:'role', title:'角色',  fixed: 'left',templet: function (t) {return t.role.rname;}}
                ,{field:'dept', title:'部门',  fixed: 'left',templet: function (t) {return t.dept.dname;}}
                ,{field:'statusName', title:'状态',  fixed: 'left'}
                ,{fixed: 'right', title:'操作', toolbar: '#barDemo'}
            ]]
            ,page: true
            ,limits:[5,10,15]
            ,id:'testReload'
            ,done:function (rtn) {
                var roles=rtn.list;
                var html='<option value="" >全部</option>';
                for(var i=0;i<roles.length;i++){
                    html+="<option value='"+roles[i].rid+"'>"+roles[i].rname+"</option>";
                }
                $('#s1').html(html);
                layui.use(['form', 'layedit', 'laydate'], function () {
                    var form = layui.form;
                    form.render('select');
                });
            }
        });

        //头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'insertPeople':
                    parent.layer.open({   //打开一个弹出层
                        title: '新增信息',   //弹出层的标题
                        maxmin: true,
                        type: 2,
                        content: '/people/add', //要访问的地址
                        area: ['800px', '600px'], //弹出层的大小
                        end: function () { //表示弹出层关闭的时候的代码块
                            location.reload();
                        }
                    });
                    break;
            };
        });

            //监听行工具事件
        table.on('tool(test)', function(obj){
            var data = obj.data;
            //console.log(obj)
            if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){
                    //AJAX
                    $.ajax({
                        url:"/people/deletePeople",
                        type:"get",
                        data:{id:data.pid},
                        success:function(data){
                            var da=data;
                            alert(da.msg);
                            location.reload();
                        }
                    });

                });
            }  else if(obj.event === 'edit'){
                parent.layer.open({   //打开一个弹出层
                    title: '修改信息',   //弹出层的标题
                    maxmin: true,
                    type: 2,
                    content: '/people/Update?pid='+data.pid, //要访问的地址
                    area: ['800px', '600px'], //弹出层的大小
                    end: function () { //表示弹出层关闭的时候的代码块
                        location.reload();
                    }
                });
            }else if(obj.event === 'jihuo'){
                layer.confirm('确定修改状态', function(index){
                    //AJAX
                    $.ajax({
                        url:"/people/updateStatus",
                        type:"post",
                        data:{pid:data.pid,status:data.status},
                        success:function(data){
                            var da=data;
                            alert(da.msg);
                            location.reload();
                        }
                    });

                });
            }
        });
    });
    layui.use(['form', 'layedit', 'laydate'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;

        var ins22 = laydate.render({
            elem: '#test5'
            ,type:'datetime'
        })
        var ins22 = laydate.render({
            elem: '#test1'
            ,type:'datetime'
        });
    });

    //查询方法
    function sear() {
        var $ = layui.$
        var param = JSON.stringify($('#myform').serializeObject());

        layui.use(['laypage', 'layer', 'table'], function () {
            var laydate = layui.laydate //日期
                , laypage = layui.laypage //分页
                , table = layui.table; //表格
            table.reload('testReload', {
                url:'/people/pagePeople?param='+encodeURIComponent(param)
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        });
    }

</script>

</body>
</html>
